$(document).ready(function () {
    // 错误提示函数
    function showError(element, message) {
        const errorElement = element.next('.error-message');
        if (errorElement.length) {
            errorElement.text(message);
        } else {
            element.after('<span class="error-message" style="color: #dc3545; font-size: 0.875em; margin-top: 0.25rem; display: block;">' + message + '</span>');
        }
    }

    // 清除错误提示
    function clearError(element) {
        element.next('.error-message').remove();
    }

    // 昵称验证
    function validateNickname() {
        const nickname = $('#nickname').val().trim();
        const regex = /^[\u4e00-\u9fa5a-zA-Z0-9_]{2,10}$/;
        if (!nickname) {
            showError($('#nickname'), '昵称不能为空');
            return false;
        } else if (!regex.test(nickname)) {
            showError($('#nickname'), '昵称必须为2-10个字符，可包含中文、英文、数字和下划线');
            return false;
        } else {
            clearError($('#nickname'));
            return true;
        }
    }

    // 邮箱验证
    function validateEmail() {
        const email = $('#email').val().trim();
        const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
        if (!email) {
            showError($('#email'), '邮箱不能为空');
            return false;
        } else if (!regex.test(email)) {
            showError($('#email'), '请输入有效的邮箱地址');
            return false;
        } else {
            clearError($('#email'));
            return true;
        }
    }

    // 内容验证
    function validateContent() {
        const content = $('#content').val().trim();
        if (!content) {
            showError($('#content'), '留言内容不能为空');
            return false;
        } else if (content.length < 5) {
            showError($('#content'), '留言内容至少需要5个字符');
            return false;
        } else if (content.length > 500) {
            showError($('#content'), '留言内容不能超过500个字符');
            return false;
        } else {
            clearError($('#content'));
            return true;
        }
    }

    // 实时验证绑定
    $('#nickname').on('blur', validateNickname);
    $('#email').on('blur', validateEmail);
    $('#content').on('input blur', validateContent);

    // 表单提交前总验证
    $('#messageForm').on('submit', function (e) {
        const isNicknameValid = validateNickname();
        const isEmailValid = validateEmail();
        const isContentValid = validateContent();

        if (!isNicknameValid || !isEmailValid || !isContentValid) {
            e.preventDefault();
            $('html, body').animate({ scrollTop: 0 }, 300);
        }
    });
});